<template>
	<view class="content">
		<!-- 顶部导航栏组件 -->
		<QSNavbar :navbarItems="navbarItems_1" backgroundColor="#2F75FA"></QSNavbar>
		<!-- 气泡背景图 -->
		<view class="bubble-back">
			<u--image :src="bubbleBackgroundImage" width="100%" :showMenuByLongpress="false" mode="widthFix">
			</u--image>
			<view class="text-info">
				<u--text text="手机号快捷登录" size="20" :bold="true"></u--text>
				<u--text text="信息将于当前账号绑定(用于身份验证)" size="16"></u--text>
			</view>
			<view class="getPhoneNumber">
				<!-- <button  open-type="getUserInfo" @getuserinfo="getUser">
				
								登录/注册
						</button>
						  <button class="login-btn" type="primary" @click="getUserInfo">
						        微信用户一键登录
						      </button>
							  <button class="btn" open-type="getUserInfo" @click="bindGetUserInfo">授权登录</button> -->
				
					<!-- <button class="btn" open-type="getUserInfo" @click="bindGetUserInfo">授权登录</button> -->
				<u-button type="primary" text="手机号快捷登录" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber"></u-button>
			</view>
			 <!-- 最新登录头像昵称 -->
			<!-- <button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				<image :src="avatarUrls" mode="" style="width: 40rpx;height: 40rpx;"></image>
			</button> 
			<input type="nickname" class="weui-input" placeholder="请输入昵称"/> -->
			<!-- <view class="" style="width: 200rpx; height: 1000rpx;">
				 <u-tooltip text="下方显示" direction="bottom"></u-tooltip>
				{{popo}}
			
			</view> -->
			<!-- <u--textarea v-model="value1" placeholder="请输入内容" ></u--textarea> -->
		</view>
	</view>
</template>

<script>
	import QSNavbar from '@/components/QS-Navbar/QS-Navbar.vue';
	const index = require('@/api/personal/index.js')
	export default {
		components: {
			QSNavbar
		},
		data() {
			return {
				navbarItems_1: [{
					type: 'icon',
					icon: 'back',
					layout: 'left',
					width: 15,
					doEvent: 'back',
					iconColor: '#fff'
				}, {
					type: 'text',
					text: '',
					width: 70,
					weight: 'bold',
					color: '#fff',
					textAlign: 'left'
				}],
				bubbleBackgroundImage: this.$https.assetsPath + '3a2d36f8b226f37603f756fef62f2b91c8091ef8.png',
				encryptedData:'',
				iv:"",
				codes:'',
				popo:"",
				value1: '',
				avatarUrls:'https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/75345690b19185b928428b228453948fbce293ba.png'
			};
		},
		onLoad(options) {
			let that = this
			// that.initData()
			that.navbarItems_1[1].text = options.applet_name
			wx.login({
			  success (res) {
				// if (res.code) {
					that.codes = res.code
					console.log(that.codes,'2222')
				// }
			  }
			})
		},
		methods: {
			onChooseAvatar(e) {
				console.log(e,'12132132')
			   this.avatarUrls =e.detail.avatarUrl
			  },
			// 数据初始化
			// async initData() {
			// 	// 获取页面设置配置
			// 	const _this = this;
			// 	// 获取学员资料
			// 		let params = {
			// 			app_id: this.$https.weixinAppId,
			// 		}
			// 		let res = await index.getProjectIdByAppId(params)
			// 		if (res.code == 1) {
			// 		}
					
				
			// },
			// getUser(e) {
			// 	console.log(e, '5685698569')
			// 	// 获取用户信息
			// 	uni.getUserInfo({
			// 	  provider: 'weixin',
			// 	  success: function (infoRes) {
			// 	    console.log('用户昵称为：' + infoRes.userInfo);
			// 	  }
			// 	});
			// },
			// getUserInfo() {
			//      uni.getUserInfo({
			//        provider: 'weixin',
			//        success: (res) => {
			// 		 uni.login({
			// 		   provider: 'weixin', //使用微信登录
			// 		   success: function (loginRes) {
			// 		   }
			// 		 });
			//        },
			//      });
			//    },
			bindGetUserInfo() {
			       uni.getUserProfile({
			         desc: '用于完善资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
			         success: (res1) => {
					   this.iv = res1.iv
					   this.encryptedData = res1.encryptedData
			           // if (!res1.encryptedData || !res1.iv) return false;
			           // this.getOpenIdAndSessionKey({
			           //   appid: 'wxa3ab0b1d7acd86fd',
			           //   code: this.code,
			           //   callback: (res2) => {
			           //     if (res2.data) this.transmitData(
			           //       res2.data.openid,
			           //       res1.iv,
			           //       res1.encryptedData,
			           //       res2.data.session_key,
			           //       'wxa3ab0b1d7acd86fd',
			           //     )
			           //   }
			           // })
			         },
			         fail:(res)=>{
			           uni.showToast({
			             icon:"none",
			             title:'用户拒绝获取'
			           })
			         }
			       })
						
			     },
			onGetPhoneNumber(e){
				console.log(e,'456')
				let that = this
				if(e.detail.errMsg=="getPhoneNumber:fail user deny"){       //用户决绝授权
					//拒绝授权后弹出一些提示
				}else{      //允许授权
					// wx.login({
					//   success (res) {
					// 	if (res.code) {
					// 		console.log(res,'123')
					// 		that.codes = res.code
					// 	  //发起网络请求
					// 		let params = {
					// 			appid: that.$https.weixinAppId,
					// 			encryptedData: e.detail.encryptedData,
					// 			iv: e.detail.iv,
					// 			code: res.code,
					// 			project_id: getApp().globalData.projectId,
					// 			references:uni.getStorageSync("openidlist")
					// 		}
					// 		that.appletPhoneLogin(params)
					// 	}
					//   }
					// })
					let params = {
						appid: that.$https.weixinAppId,
						encryptedData: e.detail.encryptedData,
						iv: e.detail.iv,
						code: that.codes,
						project_id: getApp().globalData.projectId,
						references:uni.getStorageSync("openidlist"), 
						invite_code:uni.getStorageSync("codescene") //二维码用户openid
					}
					that.appletPhoneLogin(params)
				}
			},
			async appletPhoneLogin(params){
				let that = this
				let data = params
				let result = await index.appletPhoneLogin(data)
				if(result.code == 1){
					uni.setStorageSync('phone',result.data.phone)
					uni.setStorageSync('openid',result.data.openid)
					uni.removeStorage({
						key: 'openidlist',
						success: function (res) {
						}
					});
					uni.showLoading({
						success(res) {
							if(res.errMsg == 'showLoading:ok'){
								uni.hideLoading()
								uni.reLaunch({
									url: '/pages/personal/personal'
								})
							}
						}
					})
				}else{
					uni.showToast({
						icon: 'none',
						mask: true,
						title: '授权失败，请稍后再试'
					})
				}
			}
		}
	}
</script>

<style lang="scss">
.content {
	display: flex;
	flex-direction: column;
}
.bubble-back {
	width: 100%;
	height: 400rpx;
	position: relative;
}
.text-info{
	display: flex;
	flex-direction: column;
	padding: 30rpx;
}
.getPhoneNumber{
	width: 700rpx;
	display: block;
	margin: auto;
}

.avatar-wrapper{
	border: none !important;
	background-color: #fff !important;
}

</style>
